<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="utf-8"/>
    <title>Simple example - Editor.md examples</title>
    <link th:href="@{/css/style.min.css}" type="text/css" rel="stylesheet"></link>
    <link rel="stylesheet" th:href="@{/lib/editor.md-master/css/editormd.css}"/>
    <link rel="shortcut icon" href="https://pandao.github.io/editor.md/favicon.ico" type="image/x-icon"/>
</head>
<body>
<div id="layout">
    <header>
        <h1>Simple example</h1>
    </header>
    <div id="test-editormd" class="editormd">
                <textarea style="display:none;">[TOC]

#### Disabled options

- TeX (Based on KaTeX);
- Emoji;
- Task lists;
- HTML tags decode;
- Flowchart and Sequence Diagram;

#### Editor.md directory

    editor.md/
            lib/
            css/
            scss/
            tests/
            fonts/
            images/
            plugins/
            examples/
            languages/
            editormd.js
            ...

```html
&lt;!-- English --&gt;
&lt;script src="../dist/js/languages/en.js"&gt;&lt;/script&gt;

&lt;!-- 繁體中文 --&gt;
&lt;script src="../dist/js/languages/zh-tw.js"&gt;&lt;/script&gt;
```
</textarea>
    </div>
</div>
<script th:inline="javascript" type="text/javascript">
    var base_url = /*[[@{/}]]*/'';
    var ctx = base_url;
    var project_prefix = ctx;
    //附件访问前缀:  前缀/id
    var file_prefix = "/attachment/visit/";
    var storage = window.storage || {
        get: function () {
        }
    };
    var htx = [[${#httpServletRequest.getScheme() + "://" + #httpServletRequest.getServerName() + (#httpServletRequest.getServerPort()==80?"":(":"+#httpServletRequest.getServerPort())) + #httpServletRequest.getContextPath()}]];
    base_url = htx;
    project_prefix = htx;
</script>
<script th:src="@{/lib/jquery/jquery-1.12.4.min.js}"></script>
<script th:src="@{/lib/editor.md-master/lib/marked.min.js}"></script>
<script th:src="@{/lib/editor.md-master/lib/prettify.min.js}"></script>
<script th:src="@{/lib/editor.md-master/lib/raphael.min.js}"></script>
<script th:src="@{/lib/editor.md-master/lib/underscore.min.js}"></script>
<script th:src="@{/lib/editor.md-master/lib/sequence-diagram.min.js}"></script>
<script th:src="@{/lib/editor.md-master/lib/flowchart.min.js}"></script>
<script th:src="@{/lib/editor.md-master/lib/jquery.flowchart.min.js}"></script>
<script th:src="@{/lib/editor.md-master/editormd.min.js}"></script>
<script th:src="@{/js/nojs.js}"></script>

<script type="text/javascript">
    var testEditor;

    $(function () {
        testEditor = editormd("test-editormd2", {
            width: "90%",
            height: 640,
            syncScrolling: "single",
            path: htx + "/lib/editor.md-master/lib/"
        });

        /*
        // or
        testEditor = editormd({
            id      : "test-editormd",
            width   : "90%",
            height  : 640,
            path    : "../lib/"
        });
        */
    });
</script>
</body>
</html>